<template>
	<view class="content">
		<view class="form">
			<view class="input_box u-flex">
				<view class="input_tit">
					机构名称
				</view>
				<input type="text" v-model="name" placeholder="请输入机构名称">
			</view>
            <view class="input_box u-flex">
            	<view class="input_tit">
            		机构级别
            	</view>
                <view class="u-flex u-flex-1" @click="show = true">
                    <input type="text" v-model="level" placeholder="请选择机构级别" disabled>
                    <u-icon name="arrow-down-fill" size="24" color="#ababab" class="u-p-l-10"></u-icon>
                </view>
            </view>
			<view class="input_box u-flex">
				<view class="input_tit">
					机构码
				</view>
				<input type="text" v-model="code" placeholder="请输入机构码">
			</view>
		</view>
		
		<view class="submit" @click="$noMultipleClicks(doSubmit)">提交</view>
        <!-- <view class="submit">确认编辑</view> -->
        
        <!-- 机构级别 -->
        <u-select v-model="show" mode="single-column" value-name="id" label-name="name" :list="list" @confirm="confirm"></u-select>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                noClick:true,//连点
				id: '',
                show: false,
                list: [],
                level: '',
                levelId: '',
                name: '',
                code: '',
			}
		},
        onLoad(option) {
            if (option.id) {
                this.id = option.id
                this.getData()
                uni.setNavigationBarTitle({
                	title:'编辑'
                })
            }
            this.getList()
        },
		methods: {
			doSubmit() {
			    if (!this.name) {
			        this.$toast('请输入机构名称！');
			        return false;
			    }
			    if (!this.levelId) {
			        this.$toast('请选择机构级别！');
			        return false;
			    }
			    if (!this.code) {
			        this.$toast('请输入机构码！');
			        return false;
			    }
			    this.$ajax('institution_submit', {
			        user_token: this.$getSync('userToken'),
                    name: this.name,//名称
                    code: this.code,//机构码
                    level: this.levelId,//级别id
                    id: this.id,//编辑 机构id
			    }).then(ret => {
			        if (ret.success == 1000) {
			            this.$toast('提交成功');
			            setTimeout(() => {
			                this.$backT()
			            }, 500)
			        } else {
			            this.$toast(ret.msg);
			        }
			    });
			},
            
            // 选择机构
            confirm(e) {
                console.log(e)
                this.level = e[0].label
                this.levelId = e[0].value
            },
            
            // 获取机构级别
            getList() {
            	this.$ajax('institution_level', {
            		user_token: this.$getSync('userToken'),
            	}).then(ret => {
            		if (ret.success == 1000) {
            			this.list = ret.detail.data
            		} else {
            			this.$toast(ret.msg);
            		}
            	});
            },
            
            // 获取门店详情
            getData() {
            	this.$ajax('institution_detail', {
            		user_token: this.$getSync('userToken'),
            		id: this.id,
            	}).then(ret => {
            		if (ret.success == 1000) {
                        this.name = ret.detail.name
                        this.level = ret.detail.level_name
                        this.levelId = ret.detail.level
                        this.code = ret.detail.code
            		} else {
            			this.$toast(ret.msg);
            		}
            	});
            },
		}
	}
</script>
<style>
	page{background-color: #f5f5f5!important;}
</style>
<style scoped>
.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		/* border-top: 2rpx solid #ebebeb; */
		padding: 30rpx 20rpx 0;
	}
	.form{
		width: 100%;
		border-radius: 10rpx;
		background-color: #fff;
		padding: 0 20rpx;
		margin-bottom: 50rpx;
	}
	.input_box{
		width: 100%;
		height: 110rpx;
		border-bottom: 2rpx solid #e6e6e6;
	}
    .input_box:last-child{
        border-bottom: none;
    }
	.input_tit{
		width: 150rpx;
		font: 28rpx;
		line-height: 110rpx;
		color: #30302c;
		font-weight: bold;
	}
	input{
		flex: 1;
		height: 110rpx;
		font-size: 28rpx;
		line-height: 110rpx;
		color: #000;
		text-align: right;
	}
	.submit{
		width: 100%;
		height: 92rpx;
		font-size: 36rpx;
		line-height: 92rpx;
		border-radius: 46rpx;
		color: #fff;
		text-align: center;
		background-color: #00a0e9;
	}
</style>
